<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <meta name="description" content="xms">
    <meta name="author" content="Xms">
    <link rel="icon" href="/content/favicon.ico">

    <title>组织 - 安全 - 安全角色 - 角色成员</title>

    <!-- Bootstrap core CSS -->
    <link href="/content/css/bootstrap3.3.5/bootstrap.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="/content/css/font-awesome.min.css" rel="stylesheet">
    <link href="/content/css/common.css" rel="stylesheet">
    <link href="/content/js/jquery-toast/jquery.toast.min.css" rel="stylesheet">
    <link id="themeLink" href="/content/css/theme/default.css" rel="stylesheet"/>
    <!-- Bootstrap core JavaScript ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="/content/js/jquery.min.js"></script>
    <script src="/content/js/bootstrap.min.js"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <script src="/content/js/ie10-viewport-bug-workaround.js"></script>
    <script src="/content/js/jquery.bootstrap.min.js"></script>
    <script src="/content/js/json2.js"></script>
    <script src="/content/js/xms.utility.js"></script>
    <script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.core.js"></script>
    <script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.widget.js"></script>
    <script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.mouse.js"></script>
    <script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.draggable.js"></script>
    <script src="/content/js/jquery-toast/jquery.toast.min.js"></script>
    <script src="/content/js/xms.jquery.js"></script>
    <script src="/content/js/xms.web.js"></script>
    <script src="/content/js/commonlabels.js"></script>
    <script src="/content/js/common/pagecontext.js"></script>
    <script src="/api/user/usercontext"></script>
    <script>
        jQuery(function () {
            Xms.Web.Loading();
            if (typeof parent !== 'undefined') {
                if (parent != window) {//判断当前页面是否为子页面
                    $('body').addClass('xms-subpage');
                }
            }
        });

        function changeTheme(body, themename) {
            $("#themeLink").attr('href', '/content/css/theme/' + themename + '.css');
        }
    </script>
    <link href="/content/js/bootstrap-datepicker-1.5.0/css/bootstrap-datepicker3.min.css" rel="stylesheet">
    <link href="/content/js/jquery-ui-1.10.3/themes/base/jquery.ui.all.css" rel="stylesheet">
    <link href="/content/js/grid/pqgrid.dev.css" rel="stylesheet">
    <style>
        body {
            padding-top: 0;
        }
    </style>
</head>

<body data-spy="scroll" data-target="#myScrollspy">
<div class="container-fluid" id="body">
    <div class="row">
        <div class="shadeBox"
             style="background-color:#000000; opacity:0.5;width:100%;position:absolute;z-index:10;display:none;"></div>
        <div class="col-md-12" id="main" style="margin-bottom:80px;">
            <div><br class="breadcrumb"/></div>
            <div id="content"></div>
            <div class="page-render-wrap">
                <!--main-->

                <div class="row">
                    <div class="col-sm-2" id="myScrollspy">
                        <div class="list-group" id="myNav">
                            <a href="#section-2" class="list-group-item" data-target="#section-2">安全角色 <em
                                    class="pull-right glyphicon glyphicon glyphicon-chevron-right"></em></a>
                            <a href="#section-1" class="active list-group-item" data-target="#section-1">成员 <em
                                    class="pull-right glyphicon glyphicon glyphicon-chevron-right"></em></a>
                        </div>
                    </div>
                    <div class="col-sm-10" id="scroll-body">
                        <div id="section-1" class="panel panel-default">
                            <div class="panel-heading">
                                <div class="panel-title">
                                    <strong>角色成员</strong>
                                </div>
                            </div>
                            <div id="collapseTwo" class="panel-collapse collapse in">
                                <div class="panel-body">
                                    <div id="gridview">
                                        <div class="mb-2 toolbar">
                                            <form action="" class="form-horizontal"
                                                  id="searchForm" method="get" role="form">
                                                <div class="row">
                                                    <div class="col-sm-6">
                                                        <div class="btn-group btn-group-sm">
                                                            <a class="btn btn-info btn-xs" href="javascript:addUsers()"><span
                                                                    class="glyphicon glyphicon-user"></span> 加入成员</a>
                                                            <a class="btn btn-warning btn-xs"
                                                               href="javascript:removeUsers()">
                                                                <span class="glyphicon glyphicon-minus-sign"></span>
                                                                移除成员
                                                            </a>
                                                        </div>
                                                    </div>
                                                    <div class="col-sm-6">
                                                        <div class="input-group input-group-sm">
                                                            <input class="form-control" name="membername"
                                                                   placeholder="名称" type="text" value=""/>
                                                            <span class="input-group-btn">
                                        <button type="submit" class="btn btn-info btn-block grid-searcher"><span
                                                class="glyphicon glyphicon-search"></span> 查询</button>
                                    </span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                        <div class="table-datagrid-view">
                                            <div class="datagrid-view"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div id="section-2" class="hide">
                        </div>
                    </div>
                </div>
            </div>
            <nav class="navbar navbar-default navbar-fixed-bottom hide" role="navigation" id="body-footer">
                <div class="container">
                    <div class="navbar-form navbar-right" id="body-footer-content">
                    </div>
                </div>
            </nav>
        </div>
    </div>
</div>

<script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.button.js"></script>
<script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.mouse.js"></script>
<script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.autocomplete.js"></script>
<script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.draggable.js"></script>
<script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.resizable.js"></script>
<script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.tooltip.js"></script>
<script src="/content/js/common/filters.js"></script>
<script src="/content/js/grid/pqgrid.dev.js"></script>
<script src="/content/js/grid/localize/pq-localize-zh.js"></script>
<script src="/content/js/cdatagrid.js"></script>
<script>
    var model = $.urlParamObj(location.href);
    var roleid = model.roleid;
    $(function () {
        $('#section-2').attr('data-url', ORG_SERVERURL + '/security/role/edit?id=' + roleid);
        $("#myNav").affix({
            offset: {
                top: 125
            }
        });
        $('#myNav').on('click', 'a', function (e) {
            var target = $($(this).attr('data-target'));
            var dataUrl = target.attr('data-url');
            $(this).siblings("a").removeClass("active").end().addClass("active");
            if (dataUrl) {
                location.href = dataUrl;
            }
            $('#scroll-body > div').addClass('hide');
            target.removeClass('hide');
        });
        var theaders = {
            'name': '名称',
            'typecode': '类型'
        }
        //列数据配置数据
        var columnConfigs = [
            //从新配置复选框列的渲染方式，
            {
                title: "", dataIndx: "recordid", maxWidth: 48, minWidth: 48, align: "center", resizable: false,
                type: 'checkBoxSelection', cls: 'ui-state-default', sortable: false, editable: false,
                render: function (ui) {
                    //  console.log(ui)
                    return '<input type="checkbox" value="' + ui.rowData.systemuserroleid + '" name="recordid" class="">'
                },
                cb: {all: true, header: true}
            },
            {
                "dataIndx": "membername",
                "title": theaders.name,
                editable: false,
                "dataType": "string",
                "width": 150,
                "isprimaryfield": false,
                "attributetypename": "string"
            },
            {
                "dataIndx": "typecode",
                "title": theaders.typecode,
                editable: false,
                "dataType": "string",
                "width": 150,
                "isprimaryfield": false,
                "attributetypename": "string",
                render: function (ui) {
                    var datas = ui.rowData;
                    var dataIndx = ui.dataIndx;
                    var value = datas[dataIndx];
                    var typename = value == 1 ? '用户' : '团队';
                    return typename;
                }
            }
        ];
        var url = ORG_SERVERURL + '/api/security/role/member/list?roleid='+roleid+'&';
        var $form = $('#searchForm');
        var filters = new XmsFilter();
        var datagridconfig = {
            scrollModel: {autoFit: true},
            baseUrl: url,
            columnConfigs: columnConfigs,//字段配置信息
            context: $('#toolbar'),//操作按钮方法触发
            filters: filters//post提交时过滤条件
            ,searchForm: $form//GET提交时查询的数据
        };
        $('.datagrid-view').xmsDataTable(datagridconfig);
    });

    function rebind() {
        $('.datagrid-view').cDatagrid('refreshDataAndView')
    }

    function addUsers() {
        Xms.Web.OpenDialog('/entity/RecordsDialog?entityname=systemuser&singlemode=false', 'selectRecordCallback')
    }

    function selectRecordCallback(result, inputid) {
        var ids = [];
        $(result).each(function (i, n) {
            ids.push(n.id);
        });
        if (!ids || ids.length == 0) {
            return;
        }
        Xms.Web.Post('/api/security/role/member/add', {memberid: ids, roleid: roleid, typecode:1}, false, function (response) {
            if (response.IsSuccess) {
                rebind();
            } else {
                Xms.Web.FailureHandler(response);
            }
        }, null, true, false);
    }

    function removeUsers() {
        Xms.Web.Confirm('', '', function () {
            var target = $('#gridview table');
            var ids = Xms.Web.GetTableSelected(target);
            if (!ids || ids.length == 0) {
                Xms.Web.Toast(LOC_NOTSPECIFIED_RECORD, false);
                return;
            }
            Xms.Web.Post('/api/security/role/member/removebyid', {memberid: ids, roleid: roleid}, false, function (response) {
                if (response.IsSuccess) {
                    rebind();
                } else {
                    Xms.Web.FailureHandler(response);
                }
            }, null, true, false);
        });
    }
</script>

</body>
</html>